<template>
	<view class="car-list-com" :class="pageType">
		<view class="list-item">
			<view class="item">
				<view class="title">车架号：</view>
				<view class="value">{{ item.vin }}</view>
			</view>
			<view class="item">
				<view class="title">车型：</view>
				<view class="value">{{ item.hpzl }}</view>
			</view>
		</view>
		<view class="list-item">
			<view class="item">
				<view class="title">车牌号：</view>
				<view class="value">{{ item.hphm }}</view>
			</view>
			<view class="item">
				<view class="title">里程表：</view>
				<view class="value">{{ item.lCb }}</view>
			</view>
		</view>
		<view class="list-item">
			<view class="item">
				<view class="title">采购员：</view>
				<view class="value">{{ item.member.name }}</view>
			</view>
			<view class="item">
				<view class="title">采购时间：</view>
				<view class="value">{{ formatISODate(item.createTime) }}</view>
			</view>
		</view>

		<view class="status" v-if="pageType === 'kg_todo'">{{ getAuto(item) }}</view>



		<view v-if="pageType === 'kg'" class="wb-zb-list">
			<view class="wb-zb-list-item" @click="historyList('维保记录')">维保记录</view>
			<view class="wb-zb-list-item" @click="historyList('整备记录')">整备记录</view>
		</view>
	</view>
</template>

<script>
import {
	formatISODateTime
} from '@/utils/index.js'
export default {
	props: {
		item: {
			type: Object,
			default: {}
		},
		name: {
			type: String,
			default: ""
		},
		pageType: {
			type: String,
			default: ""
		}
	},
	data() {
		return {}
	},
	methods: {
		getAuto(data) {
			if (data.isDel) {
				return "驳回至" + data.member.name;
			}
			if (!data.isJC) {
				return "检测列表中";
			}
			if (!data.isZb) {
				return "整备列表中";
			}

			if (data.isZb && data.isJC && !data.isDel) {
				return "后台审核";
			}
		},
		formatISODate(time) {
			return formatISODateTime(time)
		},
		historyList(value) {
			if (value === '维保记录') {
				uni.navigateTo({
					url: `/pages/repairInquiry/index?id=${this.item.id}`
				})
			} else {
				uni.navigateTo({
					url: `/pages/preparationRecord/index?id=${this.item.id}`
				})
			}
		}
	}
}
</script>

<style lang="scss" scoped>
.car-list-com {
	padding: 20rpx;
	background-color: #ffffff;
	border-radius: 13rpx;
	box-shadow: rgba(100, 100, 111, 0.2) 0px 7rpx 29rpx 0px;
	margin-bottom: 20rpx;
	position: relative;



	.wb-zb-list {
		margin-top: 20rpx;
		display: flex;
		align-items: center;
		justify-content: space-around;

		.wb-zb-list-item {
			flex: 1;
			text-align: center;
			font-size: 24rpx;
			color: #409eff;
		}
	}

	.list-item {
		display: flex;
		align-items: center;
		justify-content: space-between;

		.item {
			flex: 1;
			text-align: start;
			display: flex;
			align-items: center;
			line-height: 40rpx;
			white-space: nowrap;
			text-overflow: ellipsis;
			overflow: hidden;

			.title {
				font-size: 24rpx
			}

			.value {
				flex: 1;
				font-size: 24rpx;
				white-space: nowrap;
				text-overflow: ellipsis;
				overflow: hidden;
			}
		}
	}
}

.kg_todo {
	padding-top: 50rpx;

	.status {
		padding: 5rpx 10rpx;
		position: absolute;
		top: 0rpx;
		right: 0rpx;
		background: #409eff;
		color: #fff;
		border-radius: 0 13rpx 0 13rpx;
		font-size: 24rpx;
	}
}
</style>